﻿
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection" />
    <meta content="email=no" name="format-detection" />
    <meta content="initial-scale=1.0,user-scalable=no,maximum-scale=1" media="(device-height: 568px)" name="viewport" />
    <title>首页</title>
    <script src="~/Scripts/vue.min.js"></script>
    <script src="~/Scripts/ElementUI/element-ui.js"></script>
    <link href="~/Element/element-ui.css" rel="stylesheet" />
    <link href="~/Content/nprogress.css" rel="stylesheet" />
    <script src="~/Scripts/js-cookie/js.cookie-2.2.1.min.js"></script>
    <script src="~/Scripts/axios.min.js"></script>
    <link href="~/Scripts/font-awesome.min.css" rel="stylesheet" />
    <script src="~/Scripts/jquery-1.8.1.min.js"></script>
    <script src="~/Scripts/nprogress.min.js"></script>
    <script src="~/iconfont/iconfont.js"></script>
    <link href="~/iconfont/iconfont.css" rel="stylesheet" />
    <link href="~/Content/reset.css" rel="stylesheet" />
    <style>
        .el-badge__content.is-fixed{
            top:8px;
            right:2px;
        }
        #app .el-input__inner{
            border-radius:25px;
            height:32px;
        }
    </style>
</head>
<body>  
    <div id="app"> 
      <el-row style="height:40px;line-height:40px;width:100%; text-align:center;background:#fff">
          <el-col :span="4"><img src="~/Content/hello.png" width="25px" height="25px" style="vertical-align: middle;"/></el-col>
          <el-col :span="16">
              <el-input placeholder="请输入内容" v-model="search">
                  <i slot="suffix" class="el-input__icon el-icon-search" style="cursor:pointer;" v-on:click="searchKey"></i>
              </el-input>
          </el-col>
          <el-col :span="4">
              <a href="/Car/BuyCar" target="_blank">
                  <el-badge v-model="Carcount" type="primary" >
                      <i class="el-icon-shopping-cart-1"></i>
                  </el-badge>
              </a>
          </el-col>
      </el-row>
    </div>
    <script>
        var vm = new Vue({
            el: "#app",
            data() {
                return {
                    Carcount: 0,
                    search: '',

                }
            },
            methods: {
                searchKey() {
                    if (this.search == '' || this.search == null) {
                        this.$message.error('请输入所需要的内容');
                    } else {
                        location.href = '/Home/SearchMusic'
                        localStorage.setItem('keyword', this.search)

                    }
                },
                CatCount() {
                    var lists = JSON.parse(localStorage.getItem('BuyLists')) || [];
                    this.Carcount = lists.length
                }
            },
            mounted() {
                setInterval(() => {  //创建定时器
                    this.CatCount()
                }, 100);
            },
        })
    </script>
</body>
</html>
